import { ref, onMounted } from 'vue'
import { RequestAllArticle, RequestArticleDel } from '../../api/path/index.js'
export const articleContent = () => {
    const type = ref('Edit')
    const index = ref(0)
    let show = ref(false) //是否显示添加/删除的组件
    const total = ref(0) //总共多少数据
    const page = ref(1)
    const searchValue1 = ref({
        title: '',
        type: '',
        status: '',
    })
    const pageChange = async (value: number) => {
        page.value = value
        const a = await RequestAllArticle({
            page: page.value,
            rows: 15,
            title: searchValue1.value.title,
            type: searchValue1.value.type,
            status: searchValue1.value.status,
        })
        tableData.value = a.resultObj.articles
        total.value = a.resultObj.totalCount
        console.log('获取成功', a.resultObj)
        for (let i = 0; i < tableData.value.length; i++) {
            tableData.value[i].createdAt =
                tableData.value[i].createdAt.slice(0, 10) +
                ' ' +
                ' ' +
                tableData.value[i].createdAt.slice(11, 16)
        }
    }
    
    const type_options = ref<any>([])
    /**
     * 挂载
     */
    onMounted(() => {
        acquireList()
    })
    // 表格数据
    const tableData = ref<any>([])
    /**
     * 获取列表
     */
    const acquireList = async () => {
        const a = await RequestAllArticle({ page: page.value, rows: 15 })
        tableData.value = a.resultObj.articles
        total.value = a.resultObj.totalCount
        console.log('获取成功', a.resultObj)
        for (let i = 0; i < tableData.value.length; i++) {
            tableData.value[i].createdAt =
                tableData.value[i].createdAt.slice(0, 10) +
                ' ' +
                ' ' +
                tableData.value[i].createdAt.slice(11, 16)
        }
    }

    // 传递添加/编辑组件的数据
    const formdate = ref({
        id: '',
        title: '',
        content: '',
        articleType: '',
        status: '',
    })

    // 关闭添加/删除的组件
    const close = (showValue: any) => {
        show.value = showValue
        acquireList()
    }

    /**
     *  点击编辑
     */
    const handleEdit = (index1: number, item: any) => {
        type.value = 'Edit'
        show.value = true
        formdate.value = {
            id: item.row.id,
            title: item.row.title,
            content: item.row.content,
            articleType: item.row.articleType,
            status: item.row.status,
        }
        index.value = index1
        console.log('编辑', item.row)
    }

    /**
     * 点击添加按钮
     */
    const addBtn = () => {
        type.value = 'Add'
        show.value = true
        formdate.value = {
            id: '',
            title: '',
            content: '',
            articleType: '',
            status: '',
        }
    }

    /**
     * 点击删除
     */
    const ids = ref<any>([])
    const handleDelete = async (id: any) => {
        ids.value.push(id)
        console.log(ids.value)
        new Promise((resolve, reject) => {
            RequestArticleDel({ ids: ids.value })
                .then((res: any) => {
                    console.log('删除成功')
                    resolve(res.data)
                    acquireList()
                })
                .catch((err: any) => {
                    console.log('请求失败')
                    reject(err.data)
                })
        })
        ids.value = []
    }
    /**
     * 遮罩层点击事件
     */
    const maskBtn = () => {
        show.value = false
        acquireList()
    }
    /**
     * 表格序号
     */
    const indexMethod = (index1: number) => {
        return (index1 + 1) * 1
    }

    return {
        tableData,
        formdate,
        type_options,
        show,
        total,
        type,
        close,
        handleEdit,
        addBtn,
        handleDelete,
        maskBtn,
        pageChange,
        indexMethod,
        acquireList,
        searchValue1,
    }
}
